﻿/// <reference path="../jquery-1.5.1.js" />
/// <reference path="../jquery-1.5.1-vsdoc.js" />

/*!  
** Copyright (c) 2011 Ray Liang (http://www.dotnetage.com)
** Dual licensed under the MIT and GPL licenses:
** http://www.opensource.org/licenses/mit-license.php
** http://www.gnu.org/licenses/gpl.html
** 
**----------------------------------------------------------------
** title        : DNA client side runtime library
** version   : 2.0.1
** modified: 2011-5-21
** depends:
**    jquery.ui.core.js
**    jquery.ui.widget.js
**----------------------------------------------------------------
*/

$(function () {
    window.urlHelper = {
        // public method for url encoding
        encode: function (string) {
            return escape(this._utf8_encode(string));
        },

        // public method for url decoding
        decode: function (string) {
            return this._utf8_decode(unescape(string));
        },

        // private method for UTF-8 encoding
        _utf8_encode: function (string) {
            string = string.replace(/\r\n/g, "\n");
            var utftext = "";

            for (var n = 0; n < string.length; n++) {
                var c = string.charCodeAt(n);
                if (c < 128) {
                    utftext += String.fromCharCode(c);
                }
                else if ((c > 127) && (c < 2048)) {
                    utftext += String.fromCharCode((c >> 6) | 192);
                    utftext += String.fromCharCode((c & 63) | 128);
                }
                else {
                    utftext += String.fromCharCode((c >> 12) | 224);
                    utftext += String.fromCharCode(((c >> 6) & 63) | 128);
                    utftext += String.fromCharCode((c & 63) | 128);
                }
            }
            return utftext;
        },

        // private method for UTF-8 decoding
        _utf8_decode: function (utftext) {
            var string = "";
            var i = 0;
            var c = c1 = c2 = 0;
            while (i < utftext.length) {
                c = utftext.charCodeAt(i);
                if (c < 128) {
                    string += String.fromCharCode(c);
                    i++;
                }
                else if ((c > 191) && (c < 224)) {
                    c2 = utftext.charCodeAt(i + 1);
                    string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
                    i += 2;
                }
                else {
                    c2 = utftext.charCodeAt(i + 1);
                    c3 = utftext.charCodeAt(i + 2);
                    string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
                    i += 3;
                }
            }
            return string;
        }
    }
    window.uiHelper = {
        htmlEncode: function (strHtml) {
            if (strHtml)
                return strHtml.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
            else
                return "";
        },
        htmlDecode: function (strHtml) {
            if (this.isHtmlEncode(strHtml))
                return strHtml.replace(/&amp;/g, '&').replace(/&lt;/g, '<').replace(/&gt;/g, '>');
            return strHtml;
        },
        addBookMark: function (title) {
            var url = location.href;
            if ($.browser.mozilla) {
                window.sidebar.addPanel(title, url, '');
                return false;
            } else if ($.browser.msie) {
                window.external.AddFavorite(url, title);
                return false;
            } else {
                alert('Please use CTRL + D to bookmark this website.');
            }
        },
        isHtmlEncode: function (strHtml) {
            if (strHtml.search(/&amp;/g) != -1 || strHtml.search(/&lt;/g) != -1 || strHtml.search(/&gt;/g) != -1)
                return true;
            else
                return false;
        },
        previewBox: function (title, src) {
            var img = $('<img alt="' + title + '"style="display:none;padding: 8px;" />')
						.attr('src', src).appendTo('body');
            uiHelper.blockUI();
            img.load(function () {
                uiHelper.unblockUI();
                var _dlg = img.dialog({
                    title: title,
                    width: img.width(),
                    height: img.height(),
                    modal: true,
                    close: function () { img.remove(); }
                });
                img.dialog("widget").css({ "text-align": "center" });
            });
        },
        createDefaultLoader: function () {
            var _loader = $("<div></div>").appendTo(document.body)
            .addClass("ui-widget-content ui-corner-all ui-state-active")
            .css({
                padding: 10,
                height: 40,
                width: 150
            });
            $("<div>Loading...</div>").appendTo(_loader)
            .css({
                "text-align": "center",
                "display": "block",
                "margin-bottom": "5px"
            });
            var pgbar = $("<div></div>").appendTo(_loader).css({ height: 10 });
            if ($.fn.progressbar) {
                pgbar.progressbar();
                var iid = setInterval(function () {
                    if (pgbar) {
                        var _v = pgbar.progressbar("option", 'value');
                        if (_v == 100)
                            pgbar.progressbar("option", "value", 0);
                        else
                            pgbar.progressbar("option", "value", _v + 10);
                    }
                    else
                        clearInterval(iid);
                }, 1000);
            }
            return _loader;
        },
        blockUI: function (el, loader) {
            var _loader = null;

            if (el) {
                if ($(el).length == 0)
                    return;
                if ($(".ui-blocking:first", el).length > 0)
                    return;
            }
            else {
                if (this.blocker)
                    return;
            }

            if (loader) {
                if ($.isFunction(loader))
                    _loader = loader();
                else
                    _loader = loader;

            } else
                _loader = this.createDefaultLoader();

            var $el = null;
            //var bgLayer = null; //just use in ff
            var _w = document.documentElement.scrollWidth, _h = document.documentElement.scrollHeight, _l = 0, _t = 0;
            //block element

            if (el) {
                _w = $(el).outerWidth(true);
                _h = $(el).outerHeight(true);
                $el = $('<div></div>').appendTo(el)
			.addClass('ui-blocking')
			.css({
			    width: _w,
			    height: _h
			});
                var _pos = $(el).position();
                _l = _pos.left;
                _t = _pos.top;
            }
            else {
                //block screen
                $el = $('<div></div>')
                                .appendTo(document.body)
                                .addClass('ui-blocking')
                                .css({ width: _w, height: _h });
                document.body.style.overflow = "hidden";

            }

            //if (!$.browser.msie) {
            //$el.removeClass("ui-widget-overlay");
            $el.append($("<div></div>")
                                 .addClass("ui-widget-overlay")
                                 .css({
                                     width: _w,
                                     height: _h,
                                     left: _l,
                                     top: _t,
                                     "position": "absolute"
                                 }));
            //}
            _loader.appendTo($el);
            //$el.append(_loader);

            var _top = ($el.outerHeight(true) / 2) - (_loader.outerHeight(true) / 2);
            var _left = ($el.outerWidth(true) / 2) - (_loader.outerWidth(true) / 2);
            if ($.browser.safari)
                _left = ($el.width() / 2) - (_loader.width() / 2);

            if (el) {
                _top = _t + _top;
                _left = _l + _left;
            }
            _loader.css({
                left: _left,
                top: _top,
                position: "absolute",
                "-moz-opacity": "1",
                "filter": "Alpha(Opacity=100)"
            });

            if (el == undefined)
                this.blocker = $el;
        },
        unblockUI: function (el) {
            if (el) {
                var _blocker = $(".ui-blocking:first", el);
                if (_blocker.length > 0) {
                    _blocker.fadeOut("normal");
                    _blocker.remove();
                }
            } else {
                if (this.blocker) {
                    this.blocker.fadeOut("normal");
                    this.blocker.remove();
                    this.blocker = null;
                    document.body.style.overflow = "";
                }
            }
        },
        rgbToHex: function (str) {
            str = str.replace(/rgb\(|\)/g, "").split(",");
            str[0] = parseInt(str[0], 10).toString(16).toLowerCase();
            str[1] = parseInt(str[1], 10).toString(16).toLowerCase();
            str[2] = parseInt(str[2], 10).toString(16).toLowerCase();
            str[0] = (str[0].length == 1) ? '0' + str[0] : str[0];
            str[1] = (str[1].length == 1) ? '0' + str[1] : str[1];
            str[2] = (str[2].length == 1) ? '0' + str[2] : str[2];
            return ('#' + str.join(""));
        },
        inputDialog: function (strTitle, strInputText, fCallback) {
            var _dlg = $("<div></div>").appendTo("body").attr("title", strTitle);
            $("<div></div>").appendTo(_dlg).text(strInputText);
            $("<div></div>").appendTo(_dlg).append("<input />");
            var _input = $("input", _dlg);
            if ($.ui.textbox) _input.textbox({ value: "" });

            _dlg.dialog({
                bgiframe: true,
                show: "slide",
                hide: "slide",
                resizable: false,
                modal: true,
                buttons: {
                    "OK": function () {
                        if (_input.val()) {
                            if ($.isFunction(fCallback))
                                fCallback(_input.val());
                            $(this).dialog("close");
                        }
                        else
                            _input.focus();
                    },
                    "Cancel": function () { $(this).dialog("close"); }
                }
            });
        },
        confirm: function (title, msg, callback) {
            var _d = $("<div title='" + title + "'><p><span class=\"ui-icon ui-icon-alert\" style=\"float:left; margin:0 7px 20px 0;\"></span>" + msg + "</p></div>");
            _d.dialog({
                show: "slide",
                hide: "slide",
                modal: true,
                resizable: false,
                buttons: {
                    "Yes": function () {
                        if (callback)
                            callback();
                        _d.dialog("close");
                        _d.remove();
                    },
                    "No": function () {
                        _d.dialog("close");
                        _d.remove();
                    }
                }
            });
        },
        showMsg: function (title, msg) {
            var _d = $("<div title='" + title + "'>" + msg + "</div>");
            _d.dialog({
                show: "slide",
                hide: "slide",
                modal: true,
                overlay: {
                    backgroundColor: '#000000',
                    opacity: 0.5
                },
                buttons: {
                    "OK": function () {
                        _d.dialog("close");
                        _d.remove();
                    }
                }
            });
        },
        formatDate: function (jsonDate) {
            var tick = parseInt(jsonDate.substring(6, 19));
            return (new Date(tick)).toDateString();
        },
        insertFormat: function (element, _format) {
            if ($.browser.msie) {
                element.focus();
                var _selection = document.selection.createRange();
                _selection.text = _format.replace("{0}", _selection.text);
            }
            else {
                var _ele = element[0];
                if (_ele.selectionEnd) {
                    var _start = _ele.selectionStart, _end = _ele.selectionEnd,
                            _rep = _format.replace("{0}", _ele.value.substring(_start, _end)),
                            _pre = _ele.value.substring(0, _start),
                              _last = _ele.value.substring(_end);
                    element.val(_pre + _rep + _last);
                }
            }
        },
        showDlg: function (title, msg) { this.showMsg(title, msg); },
        fileDlg: function (_url, _el,_callback) {
            if (window.fileDlg)
                fileDlg.dialog("close");
            var _dlg = $("<div/>").appendTo("body");
            window.fileDlg = _dlg.dialog({
                title: "File dialog",
                dialogClass: "d-dialog",
                resizable: false,
                width: 915,
                height: 800,
                close: function () {
                    _dlg.html("");
                    $(".ui-dialog", "body").remove();
                    $("#AddFolderDlg").remove();
                },
                open: function () {
                    $.ajax({
                        url: _url,
                        type: "GET",
                        success: function (data) { _dlg.html(data); }
                    });
                },
                buttons: {
                    OK: function () {
                        if (_el)
                            $(_el).val($("#txtFileExplorerStatus", $(this)).val());

                        if ($.isFunction(_callback))
                            _callback($("#txtFileExplorerStatus", $(this)).val());

                        $(this).dialog("close");
                    },
                    Close: function () { $(this).dialog("close"); }
                }
            });
        }
    }
    $.dna = $dna = uiHelper;
});

(function ($) {
    $.widget("ui.portable", {
        options:
        {
            items: ".d-widget-zone",
            url: null,  //"/Widget/Load",
            mode: null,
            baseUrl: null
        },
        _create: function () {
            var self = this, opts = this.options, el = this.element,
             _zones = this.element.find(opts.items);
            if (_zones.length > 0) {
                if (opts.mode == "design") {
                    _zones.sortable({
                        connectWith: opts.items,
                        placeholder: "d-widget-placeholder", //"ui-state-highlight",
                        forceHelperSize: true,
                        forcePlaceholderSize: true,
                        revert: true,
                        opacity: 0.8,
                        helper: 'clone',
                        cursor: "move",
                        handle: "h2",
                        update: function (event, ui) {
                            try {
                                var widgets = $(".d-widget", this), _pos = -1;
                                if (widgets.length > 0)
                                    _pos = widgets.index(ui.item);
                                if (_pos != -1)
                                    ui.item.portlet("move", $(this).attr("id"), _pos);
                            }
                            catch (e) {
                                $(ui.sender).sortable('cancel');
                            }
                        }
                    });

                    _zones.addClass("d-widget-zone-design")
                               .droppable({
                                   accept: ".d-widget",
                                   activeClass: "d-widget-zone-allow-drop",
                                   hoverClass: "ui-state-highlight"
                               });
                }

                $.ajax({
                    url: opts.url,
                    cache: false,
                    data: { url: document.URL },
                    dataType: "json",
                    error: function (response) {
                        uiHelper.showDlg(response.statusText, response.responseText);
                    },
                    success: function (data) {
                        $.each(data, function (i, group) {
                            var _dockZone = $("#" + group.Key);
                            if (_dockZone.length) {
                                $("#widget_template").tmpl(group.Items).appendTo(_dockZone);
                            }
                        });
                        $(".d-widget", _zones).portlet({ design: true, baseUrl: self.options.baseUrl });
                    }
                });
            }
        }
    });
    $.widget("ui.portlet", {
        options: {
            preview: false,
            design: true,
            zoneId: "",
            dataItem: null,
            baseUrl: "/Widget/",
            exportActionUrl: "Export",
            applyActionUrl: "Apply",
            moveActionUrl: "MoveTo",
            removeActionUrl: "Delete",
            toggleActionUrl: "Toggle",
            userPreferences: "form.d-widget-userpreferences"
        },
        _create: function () {
            var self = this, opts = this.options, el = this.element;

            //fixed the url issuse
            if (opts.baseUrl) {
                opts.exportActionUrl = opts.baseUrl + opts.exportActionUrl;
                opts.applyActionUrl = opts.baseUrl + opts.applyActionUrl;
                opts.moveActionUrl = opts.baseUrl + opts.moveActionUrl;
                opts.removeActionUrl = opts.baseUrl + opts.removeActionUrl;
                opts.toggleActionUrl = opts.baseUrl + opts.toggleActionUrl;
            }

            var dat = this.options.dataItem = this.element.tmplItem().data;

            /*-------------------------Init verbs---------------------------------------*/

            var verb_export = $(">.d-widget-header .d-widget-verb-export", this.element);
            if (verb_export.length) verb_export.click(function () { self._export(); });

            var verb_del = $(">.d-widget-header .d-widget-verb-delete", this.element);
            if (verb_del.length) verb_del.click(function () { self._delete(); });


            var verb_refresh = $(">.d-widget-header .d-widget-verb-refresh", this.element);
            if (verb_refresh.length) verb_refresh.click(function () {
                self._load();
            });

            var verb_toggle = $(">.d-widget-header .d-widget-verb-toggle", this.element);
            if (verb_toggle.length) verb_toggle.click(function () { self._toggle(); });

            if (this.options.preview) {
                verb_export.remove();
                verb_del.remove();
                verb_toggle.remove();
                $(">.d-widget-footer", this.element).hide();
            }

            var verb_uf = $(">.d-widget-header .d-widget-verb-setting", this.element);
            if (verb_uf.length) verb_uf.click(function () {
                /*------TODO:Show User Prefences settings there------*/
                $(this).hide();
                self.element.find(opts.userPreferences).slideDown("fast");
            });

            if ((dat.IsExpanded) && (dat.ContentUrl)) this._load();

            var commonsettings = $(".d-widget-common-settings", this.element);
            if (commonsettings.length) {
                commonsettings.click(function () {
                    var dlg = $("#widget_setting_dlg_tmpl").tmpl(self.options.dataItem).appendTo("body");
                    dlg.dialog({
                        modal: true,
                        dialogClass: "d-dialog",
                        resizable: false,
                        buttons: {
                            "OK": function () {
                                var _form = $("form", this);
                                $.ajax({
                                    type: "POST",
                                    url: _form.attr("action"),
                                    data: _form.serialize(),
                                    error: function (response) {
                                        uiHelper.showDlg(response.statusText, response.responseText);
                                    },
                                    success: function () {
                                        with (self.options.dataItem) {
                                            Title = $("#txtWidgetTitle", _form).val();
                                            TitleLinkUrl = $("#txtWidgetTitleLink", _form).val();
                                            IconUrl = $("#txtWidgetIconLink", _form).val();
                                            ShowBorder = $("#cbShowBodyValueHolder", _form).val() == "true" ? true : false;
                                            ShowHeader = $("#cbShowHeaderValueHolder", _form).val() == "true" ? true : false;
                                        }
                                        self._updateUI();
                                        dlg.dialog("close");
                                    }
                                });
                            },
                            "Close": function () { $(this).dialog("close"); }
                        },
                        close: function () { dlg.remove(); },
                        open: function () {
                            $("input[type='text']", this).textbox({ width: 270 });
                        }
                    });
                });
            }
            var _btnDesign = $(".d-widget-designer", this.element);
            var _designerMenu = $(".d-widget-designer-menu", this.element);

            _btnDesign.buttonex({
                type: "linkbutton",
                splitButton: true,
                spliterClick: function (event) {
                    _designerMenu.dnamenu("dropdown", this);
                }
            });

            _designerMenu.dnamenu({
                type: 'context',
                delay: 100,
                hideEffect: 'slide',
                showEffect: 'slide',
                itemClick: function (event, ui) {
                    var _url = $(ui).find("input").val();
                    var _dlg = $("<div/>").appendTo("body");

                    _dlg.dialog({
                        //modal: true,
                        title: dat.Title + " - Design " + $(".d-menu-item-text", ui).text(),
                        dialogClass: "d-dialog",
                        resizable: false,
                        width: 570,
                        height: 640,
                        close: function () { _dlg.remove(); },
                        buttons: {
                            "Reset": function () {
                                var _currentElement = $(".d-current-element", _dlg);
                                $(".d-csstext-value", _dlg).val("");
                                $(_currentElement.val()).removeAttr("style");
                            },
                            "OK": function () {
                                var _styleForm = $("form", _dlg);
                                //$(".d-csstext-value", _styleForm).val($("#" + dat.ID));
                                $.ajax({
                                    type: "POST",
                                    url: _styleForm.attr("action"),
                                    data: _styleForm.serialize(),
                                    error: function (response) {
                                        uiHelper.showDlg(response.statusText, response.responseText);
                                    },
                                    success: function (data) {

                                        _dlg.dialog("close");
                                    }
                                });

                            },
                            "Close": function () {
                                $(this).dialog("close");
                            }
                        },
                        open: function () {
                            $.ajax({
                                url: _url,
                                success: function (data) {
                                    _dlg.html(data);
                                }
                            });
                        }
                    });
                }
            });
        },
        _updateUI: function () {
            var dat = this.options.dataItem, _header = $(".d-widget-header", this.element), _icon = $(".d-widget-title-icon", _header),
             _txt = $(".d-widget-title-text", _header), _link = $(".d-widget-title-link", _header);

            if (dat.ShowHeader) _header.removeClass("d-widget-header-hide");
            else _header.addClass("d-widget-header-hide");

            if (dat.ShowBorder) this.element.removeClass("d-widget-no-border");
            else this.element.addClass("d-widget-no-border");

            if (dat.IconUrl) {
                _icon.attr("src", dat.IconUrl);
                _icon.show();
            }
            else {
                _icon.hide();
            }
            _link.attr("href", dat.TitleLinkUrl ? dat.TitleLinkUrl : "javascript:void(0);");
            _txt.text(dat.Title);
        },
        _refresh: function () {
            this._load();

        },
        _export: function () { window.open(this.options.exportActionUrl + "?wid=" + this.options.dataItem.ID); },
        _delete: function () {
            var self = this, el = this.element;
            uiHelper.confirm("Are you sure?", "Are you sure to delete this widget?", function () {
                $.post(self.options.removeActionUrl, { id: self.options.dataItem.ID }, function () {
                    self.destroy();
                    el.remove();
                });
            });
        },
        _toggle: function () {
            var self = this;
            $.post(self.options.toggleActionUrl, { id: self.options.dataItem.ID });

            self.options.dataItem.IsExpanded = !self.options.dataItem.IsExpanded;
            if (self._isloaded)
                self._toggleElements();
            else
                self._load();
        },
        _toggleElements: function () {
            var self = this;
            var verb_toggle = $(">.d-widget-header .d-widget-verb-toggle", this.element),
             _body = $(">.d-widget-body", self.element)
            _body.stop().animate({
                width: 'toggle',
                height: 'toggle'
            }, {
                duration: 200,
                specialEasing: {
                    width: 'swing',
                    height: 'swing'
                },
                complete: function () {
                    self.element.toggleClass("d-widget-collapsed");
                }
            });
        },
        _load: function () {
            var self = this, opts = this.options, _body = $(">.d-widget-body", self.element);
            $.ajax({
                url: opts.dataItem.ContentUrl,
                data: {
                    wid: opts.dataItem.ID,
                    preview: opts.preview,
                    design: opts.design
                },
                beforeSend: function () {
                    _body.empty()
                    .append($("<div/>").addClass("d-loader"));
                },
                error: function (response, textStatus, errorThrown) { _body.html(response.responseText).show(); },
                success: function (htm) {

                    /*------------------Render iframe to supports W3C widgets---------------------------*/
                    _body.html(htm);
                    self._bodyWidth = _body.width();
                    self._bodyHeight = _body.height();
                    self._isloaded = true;

                    /*--------------------------------Setting form-----------------------------------------------------*/
                    var verb_up = $(">.d-widget-header .d-widget-verb-setting", self.element);
                    if (_body.find(opts.userPreferences).length) {
                        self._createUserPreferencesButtons();
                        verb_up.show();
                    }
                    else
                        verb_up.hide();

                    self.element.removeClass("d-widget-collapsed");
                    _body.show();
                }
            });
        },
        _apply: function () {
            var opts = this.options;
            this.title.text(opts.title);
            if (opts.titlelink)
                this.title.attr("href", urlHelper.encode(opts.titlelink));
            else
                this.title.attr("href", "javascript:void(0);");
            if (opts.icon)
                this.titleicon = $("<span></span>").prependTo(this.title)
                                                      .css({
                                                          "width": "16px",
                                                          "height": "16px",
                                                          "float": "left",
                                                          "margin-right": "3px",
                                                          "background-image": "url(" + opts.icon + ")"
                                                      });
            if (!this.options.showHeader) this.header.css({ opacity: "0.5" });
            this._initBodyStyle();
        },
        _initBodyStyle: function () {
            var opts = this.options;
            if (this.body) {
                if (opts.bgColor)
                    this.body.css({
                        "background-color": opts.bgColor,
                        "background-image": "none"
                    });
                if (opts.color) this.body.css({ "color": opts.color });
                if (opts.showHeader)
                    this.body.css({
                        "border-top-style": "solid",
                        "border-top-width": "1px",
                        "border-top-color": "transparent"
                    });

                if (opts.design) {
                    if (!opts.showBorder)
                        this.body.css({
                            "border-style": "dashed",
                            "border-width": "1px"
                        });
                }
                else {
                    if (!opts.showBorder)
                        this.body.css({ "border": "none" });
                }
                if (!opts.expanded) this.body.hide();
            }
        },
        _createUserPreferencesButtons: function () {
            var self = this, opts = this.options, _form = this.element.find(opts.userPreferences);

            if (_form.length) {
                //if (this.settings.buttonPanel) this.settings.buttonPanel.remove();
                var _buttonPanel = $("<div/>").appendTo(_form)
                                                               .css({
                                                                   "overflow": "auto",
                                                                   "padding": "5px"
                                                               });
                //&apply=true
                _form.submit(function (e) {
                    if (!e.isDefaultPrevented()) {
                        $.ajax({
                            type: "PUT",
                            url: opts.dataItem.ContentUrl + "?wid=" + opts.dataItem.ID + "&preview=" + opts.preview,
                            data: _form.serialize(),
                            error: function (response) { uiHelper.showDlg(response.statusText, response.responseText); },
                            success: function () {
                                _form.slideUp("fast");
                                self._load();
                            }
                        });
                    }
                    e.preventDefault();
                });

                var _btnSave = $("<button/>").appendTo(_buttonPanel)
                                                                  .click(function (event) {
                                                                      event.preventDefault();
                                                                      _form.submit();
                                                                  })
                                                                  .button({ label: "Save" });

                var _btnCancel = $("<button/>").appendTo(_buttonPanel)
                                                                                     .click(function (event) {
                                                                                         event.preventDefault();
                                                                                         _form.slideUp();
                                                                                         $(">.d-widget-header .d-widget-verb-setting", self.element).show();
                                                                                     })
                                                                                    .button({ label: "Cancel" });
            }
        },
        move: function (zid, pos) {
            $.ajax({
                type: "POST",
                url: this.options.moveActionUrl,
                data: {
                    id: this.options.dataItem.ID,
                    zoneID: zid,
                    position: pos
                },
                error: function (response) {
                    uiHelper.showDlg(response.statusText, response.responseText);
                }
            });
        },
        widget: function () {
            return this.element;
        },
        destroy: function () {
            //$(".ui-widget-menu", this.element).unbind();
            $.Widget.prototype.destroy.call(this);
        }
    });
    $.widget("ui.album", {
        options: {
            items: ".d-list-item",
            aspectRatio: 0.5
        },
        _create: function () {
            var self = this, opts = this.options, el = this.element;
            var _items = $(opts.items, el);

            //el.height(el.height());//.css({ overflow: "visible" });

            _items.addClass("d-album-item")
                     .each(function (i, n) {
                         var _item = $(">div", n), _smallWidth = _item.width(), _smallHeight = _item.height(), _marginLeft = opts.aspectRatio * _smallWidth, _marginTop = opts.aspectRatio * _smallHeight;

                         _item.bind("mouseenter", function () {
                             $(this).addClass("d-album-item-hover").css({ "z-index": "1000" }).animate({
                                 width: (_smallWidth + _marginLeft) + "px",
                                 height: (_smallHeight + _marginTop) + "px",
                                 "margin-top": "-" + _marginTop / 2 + "px",
                                 "margin-left": "-" + _marginLeft / 2 + "px",
                                 top: "0"
                             }, 100);
                         })
                     .bind("mouseleave", function () {
                         $(this).removeClass("d-album-item-hover").css({ "z-index": "2" }).animate({
                             width: _smallWidth + "px",
                             height: _smallHeight + "px",
                             top: "0px",
                             "margin-top": "0px",
                             "margin-left": "0px"
                         });
                     });
                     });
            el.height(el.height()).css({ overflow: "visible" });
        },
        destroy: function () {
            $.Widget.prototype.destroy.call(this);
        }
    });
})(jQuery);   